.texto-escuchar {
  margin: 20px auto;
  background: rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(8px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.3px solid rgba(255, 255, 255, 0.171);
  max-width: 145px; /* ajustable */
  overflow: hidden;
  border-radius: 4px;
  backdrop-filter: blur(5px) brightness(0.7);
  color:#ffffff;
}
.texto-escuchar2 {
  margin: 20px auto;
  background: rgba(255, 255, 255, 0.2);
  max-width: 230px; /* ajustable */
  overflow: hidden;
  border-radius: 4px;
  backdrop-filter: blur(5px) brightness(0.7);
  -webkit-backdrop-filter: blur(8px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.3px solid rgba(255, 255, 255, 0.171);
  color:#ffffff;
}
.libsyn-wrapper {
  margin: 20px auto;
  max-width: 800px; /* ajustable */
  overflow: hidden;
  border-radius: 12px;
  backdrop-filter: blur(5px) brightness(0.6);
  -webkit-backdrop-filter: blur(8px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.171);
  -webkit-backdrop-filter: blur(5px) brightness(0.6);
}
.libsyn-wrapper iframe {
  display: block;
  width: 100%;
  border: none;
}
/* LISTEN BUTTONS: estilos para Audio/Video */
.listen-btn {
  padding: 10px 30px;
  margin: 10px 5px 20px 0;
  border: none;
  background: rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(8px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.3px solid rgba(255, 255, 255, 0.171);
  color: #8e8e8e;
  font-size: 1rem;
  cursor: pointer;
  border-radius: 5px;
  backdrop-filter: blur(2px) brightness(0.7);
  transition: background 0.2s, color 0.2s, transform 0.2s, backdrop-filter 0.3s ease;
}
.listen-btn.active {
  /* background and color removed */
  backdrop-filter: blur(3px) brightness(0.9) saturate(100%);
  background:rgba(255, 255, 255, 0.009);
  -webkit-backdrop-filter: blur(4px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.3px solid rgba(255, 255, 255, 0.171);
  max-width: 230px; /* ajustable */
  border-radius: 5px;
  backdrop-filter: blur(5px) brightness(0.7);
  color: #ffd700;
  transform: scale(1.05);
}
.listen-btn:hover:not(.active) {
  color: #daad08;
  transform: scale(0.95);
}
/* CONTENT PANELS: contenedores audio/video */
#audio-content,
#video-content {
  margin-top: 10px;
}
.gran-titulo-escuchar{
  position: relative;
  overflow: hidden;
  margin: 20px auto;
  background:rgba(255, 255, 255, 0.009);
  -webkit-backdrop-filter: blur(4px) brightness(0.8);
  border-top: 1px solid rgba(255,255,255,0.3);
  border-bottom: 0.3px solid rgba(255, 255, 255, 0.171);
  max-width: 230px; /* ajustable */
  border-radius: 5px;
  backdrop-filter: blur(5px) brightness(0.7);
  color:#ffffff
}

/* Shine effect: moving highlight */
.gran-titulo-escuchar::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255, 255, 255, 0.157) 40% 50%,
    transparent 100%
  );
  transform: skewX(-20deg);
  animation: shine 5s infinite;
}
@keyframes shine {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}